<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>ViewIssue</title>
<%@include file="header.jsp"%>


<script type="text/javascript" charset="utf-8">
	var commentid = 0;
	var editcommentid = 0;

	$(document).ready(function() {
		$("#savecomment").click(function() {
			//alert("Save: " + $("#issueid").val() );
			
			$.ajax({
				type : "post",
				url : "../UpdateIssue?action=addcomment",
				datatype : "json",
				data : "issueid="+ viewissueid
					 + "&username="+ $("#user").val()
					 + "&comments=" + $("#txtcomment").val(),
					 success : function(data) {
						 //window.location("viewissue.jsp?issueid="+$("#issueid").val());
					 window.location.assign("viewissue.jsp?issueid="+ viewissueid);
				},
				error : function(jqXHR,textStatus) {
					 alert("Request failed: "+ textStatus);
				}
			});
		});

		$("#like").click(function() {
			alert("Liked");
		});

		
		$("#edit").click(function() {
				//alert("Edit: " + $("#issueid").val() );
				window.location.assign("editissue.jsp?issueid="+ viewissueid);
		});

		$("#issuedelete").click(function() {
			//alert("Delete: " + $("#issueid").val() );
			$("#dlgconfirmdeleteissue").modal("show");
		});
		
		
		$("#confirmdeleteissue").click(function() {
			$.ajax({
				type : "post",
				url : "../UpdateIssue?action=deleteissue",
				datatype : "json",
				data : "issueid="+ viewissueid,
				success : function(data) {
					window.location.assign("home.jsp");
				},
				error : function(jqXHR,textStatus) {
					alert("Request failed: "+ textStatus);
				}
			});
			$("#dlgconfirmdeleteissue").modal("hide");
		});

		$("#confirmdeletecomment").click(function() {
			//alert("Delete");
			$.ajax({
				type : "post",
				url : "../UpdateIssue?action=deletecomment",
				datatype : "json",
				data : "commentid="+ commentid,
				success : function(data) {
					window.location.assign("viewissue.jsp?issueid="+viewissueid);
				},
				error : function(jqXHR,textStatus) {
					alert("Request failed: "+ textStatus);
				}
			});
			$("#dlgconfirmdelete").modal("hide");
		});

		
		$("#confirmeditcomment").click(function() {
			//alert("edit: " + editcommentid);
			var editedcomment = "";
			editedcomment = $("#txtcommentedit").val().replaceAll("\n","<br/>");

			$.ajax({
				type : "post",
				url : "../UpdateIssue?action=editcomment",
				datatype : "json",
				data : "commentid="+ editcommentid
					 + "&username="+ $("#user").val()
					 + "&comments="+ editedcomment,
				success : function(data) {
					window.location.assign("viewissue.jsp?issueid="+viewissueid);
				},
				error : function(jqXHR,textStatus) {
					alert("Request failed: "+ textStatus);
				}
			});
			$("#dlgeditcomment").modal("hide");
		});

});
	
	

	function editcomment(id) {
		editcommentid = id;
		//$("#txtcommentedit").append("TEST");
		var commentdata = $("#readcomment" + id);
		$("#txtcommentedit").html(commentdata);

		$.getJSON('../GetCommentDetails?commentid=' + editcommentid, function(
				data) {
			var i;
			for (i = 0; i < data.comment.length; i++) {
				var commentdata = data.comment[0].comment;
				commentdata = commentdata.replaceAll("<br/>", "\n");
				$("#txtcommentedit").html(commentdata);
			}
		});
		$("#dlgeditcomment").modal("show");

	};

	function deletecomment(id) {
		commentid = id;
		$("#dlgconfirmdelete").modal("show");
	};


	
	
String.prototype.replaceAll = function(token, newToken, ignoreCase) {
	var _token;
	var str = this + "";
	var i = -1;

	if (typeof token === "string") {
		if (ignoreCase) {
			_token = token.toLowerCase();
			while ((i = str.toLowerCase().indexOf(token,
				i >= 0 ? i + newToken.length : 0)) !== -1) {
				str = str.substring(0, i) + newToken + str.substring(i + token.length);
			}
		} else {
			return this.split(token).join(newToken);
		}
	}
	return str;
};




var viewissueid=0;
	
function ViewPageInit(issueid, role) {

		viewissueid = issueid;
		$("#vissuetitle").html($("#title").val());
		$("#vissuedetail").html( $("#hissuedetail").val());

		var moduledetails = $("#hmodule").val() + " --> " + $("#hcategory").val() + " --> " + $("#hsubcategory").val()
		$("#vmodule").html(moduledetails);
		$("#vbugid").html($("#hbugid").val());
		$("#vversion").html($("#hversion").val());
		$("#vcreatedby").html($("#hcreatedby").val());
		$("#vcreatedon").html($("#hcreatedon").val());
		$("#vcommentcount").html($("#hcommentcount").val());

		$.ajax({
			type : "post",
			url : "../GetIssueDetail",
			datatype : "json",
			data : "issueid=" + issueid,
			success : function(data) {
			if (data.issuedetails.length > 0) {
				if (data.issuedetails[0].comments.length > 0) {
					$("#issuewriter").val(data.issuedetails[0].createdby);
					
					var j;
					$("#readcomments").html("<div>");
					var text;
					for (j = 0; j < data.issuedetails[0].comments.length; j++) {
						text = "<div class=\" viewmycomment \" >" + data.issuedetails[0].comments[j].comment + "&nbsp;&nbsp;&nbsp;";
						if (role == '2' || data.issuedetails[0].comments[j].username == $("#loginuser").val() ) {
							text = text
							+ "<a href=\"javascript:void(0)\" style=\" cursor:pointer \"  onclick=\"editcomment('"
							+ data.issuedetails[0].comments[j].id
							+ "')\"><img src=\"../images/Edit.png\"  style=\"display: inline; \" width=\"16\" height=\"16\"/></a>"
							+ "&nbsp;&nbsp;&nbsp;"
							+ "<a  href=\"javascript:void(0)\" style=\"cursor:pointer\"  onclick=\"deletecomment('"
							+ data.issuedetails[0].comments[j].id
							+ "')\" > <img src=\"../images/SettingsDelete.png\" style=\"display: inline; \" width=\"16\" height=\"16\"/></a>";
						}

					text = text
							+ "<br><b>  by  </b>"
							+ "<a href=\"javascript:void(0)\"><span> "
							+ data.issuedetails[0].comments[j].username
							+ "</span></a><b>  on  </b>"
							+ data.issuedetails[0].comments[j].date
							+ "<br/></div>";

					$("#readcomments").append(text);
					$("#readcomments").append("<br/><div>");

					}
				}
			}

		},
		error : function(jqXHR, textStatus) {
			alert("Error viewing article: " + textStatus);
		}
	});
};
</script>


</head>
<body
	onload="ViewPageInit(<%=request.getParameter("issueid")%>, <%=session.getAttribute("userrole")%>)">


	<%@include file="toppanel.jsp"%>

	<%@ page import="java.util.Map"%>
	<%
		wiki.GetDetails MyIssue = new wiki.GetDetails();
		String issueid = request.getParameter("issueid");
		Map<String, String> MyIssueDetail = MyIssue.GetIssueDetail(issueid);
	%>

<input type='hidden' id="issuewriter" />
<input type='hidden' id="loginuser"
		value="'<%=session.getAttribute("user")%>'" />
	<input type='hidden' id="issueid"
		value="'<%=request.getParameter("issueid")%>'" />
	<input type='hidden' id="user"
		value="'<%=session.getAttribute("user")%>'" />
	<input type='hidden' id="title" value="<%=MyIssueDetail.get("Title")%>" />

	<input type="hidden" id="hissuedetail"
		value="<%=MyIssueDetail.get("Details")%>" />

	<input type="hidden" id="hmodule"
		value="<%=MyIssueDetail.get("Module")%>" />


	<input type="hidden" id="hcategory"
		value="<%=MyIssueDetail.get("Category")%>" />
	<input type="hidden" id="hsubcategory"
		value="<%=MyIssueDetail.get("SubCategory")%>" />


	<input type="hidden" id="hversion"
		value="<%=MyIssueDetail.get("Version")%>" />
	<input type="hidden" id="hbugid"
		value="<%=MyIssueDetail.get("Bugid")%>" />
	<input type="hidden" id="hcreatedby"
		value="<%=MyIssueDetail.get("CreatedBy")%>" />
	<input type="hidden" id="hcreatedon"
		value="<%=MyIssueDetail.get("CreatedOn")%>" />
	<input type="hidden" id="hcommentcount"
		value="<%=MyIssueDetail.get("CommentCount")%>" />


	<div style="width: 90%; padding-left: 5%">
		<div>
			<br />

			<div class="viewmyissue">
				<table border="0" width="90%">
					<tr>
						<td style="padding-top: 5px; padding-left: 5px; font-size: 18px;"
							colspan="3"><span style="color: black" id="vissuetitle"></span></td>

					</tr>

					<tr>
						<td
							style="padding-bottom: 5px; padding-left: 5px; font-size: 12px;"
							colspan="3">by &nbsp;<span style="color: blue"
							id="vcreatedby"></span>&nbsp;on 
							<span  style="color: blue" id="vcreatedon"></span>
						</td>

					</tr>

					<tr>
					<tr>
						<td width="20%"
							style="padding-top: 5px; padding-bottom: 5px; padding-left: 5px;">Bugid:
							&nbsp;&nbsp;<span id="vbugid" style="color: blue"></span>
						</td>
						<td width="40%"
							style="padding-top: 5px; padding-bottom: 5px; padding-left: 5px;">Module:
							&nbsp;&nbsp;<span id="vmodule" style="color: blue"></span>
						</td>
						<td width="40%"
							style="padding-top: 5px; padding-bottom: 5px; padding-left: 5px;">Version:
							&nbsp;&nbsp;<span id="vversion" style="color: blue"></span>
						</td>
					</tr>
				</table>

				<hr>
				<div style="padding-left: 10px; padding-right: 5px;"
					id="vissuedetail"></div>

			</div>
			
			
			<div
				style="background-color: #F0F0F0; padding-top: 10px; padding-bottom: 10px;">
				<%
					if (session.getAttribute("userrole").toString()
							.equalsIgnoreCase("2") || MyIssueDetail.get("CreatedBy").equalsIgnoreCase(session.getAttribute("user").toString()) ) {
					
				%>
				<span style="margin-left: 10px; padding-top: 10px;" id="edit"><a
					style="cursor: pointer">Edit</a></span>
				<span style="margin-left: 10px; padding-top: 10px;" id="issuedelete"><a
					style="cursor: pointer">Delete</a></span>
				<%
					}
				%>
				<span style="margin-left: 10px; padding-top: 10px;">&nbsp;</span> <span
					class="pull-right" style="padding-right: 30px;">
					&nbsp;&nbsp; <img src="../images/comment.png" alt=""
					style="padding-bottom: 5px;" width="24" height="24" /> <span id="vcommentcount" ></span>
				</span>
				<!-- 				 <img -->
				<!-- 					id="like" src="../images/like.png" alt="" -->
				<!-- 					style="padding-bottom: 5px;" width="24" height="24" /> 7 -->






			</div>
		</div>
		<br />

		<div id="readcomments"></div>

		<br />
		<textarea id="txtcomment" rows="3" class="input-block-level"
			placeholder="Add a Comment..."></textarea>
		<input type="button" class="btn" id="savecomment" value="save" />

	</div>




	<div></div>



	<div id="dlgconfirmdelete" class="modal hide fade"
		style="display: none;">
		<div class="modal-header">
			<a href="#" class="close" data-dismiss="modal">x</a>
			<h5>Delete comment:</h5>
		</div>
		<div class="modal-body">Are you sure you want to delete the
			comment ?</div>
		<div class="modal-footer">
			<a href="#" class="btn confirm_delete_the_item no_return"
				id="confirmdeletecomment">Ok</a> <a href="#"
				class="btn btn-secondary " data-dismiss="modal">Cancel</a>
		</div>
	</div>


	<div id="dlgconfirmdeleteissue" class="modal hide fade"
		style="display: none;">
		<div class="modal-header">
			<a href="#" class="close" data-dismiss="modal">x</a>
			<h5>Delete Issue:</h5>
		</div>
		<div class="modal-body">Are you sure you want to delete the
			Issue ?</div>
		<div class="modal-footer">
			<a href="#" class="btn confirm_delete_the_item no_return"
				id="confirmdeleteissue">Ok</a> <a href="#"
				class="btn btn-secondary " data-dismiss="modal">Cancel</a>
		</div>
	</div>
	

	<div id="dlgeditcomment" class="modal hide fade" style="display: none;">
		<div class="modal-header">
			<a href="#" class="close" data-dismiss="modal">x</a>
			<h5>Edit Comment:</h5>
		</div>
		<div class="modal-body">
			<textarea id="txtcommentedit" rows="10" class="input-block-level"></textarea>
		</div>
		<div class="modal-footer">
			<a href="#" class="btn confirm_delete_the_item no_return"
				id="confirmeditcomment">Save</a> <a href="#"
				class="btn btn-secondary " data-dismiss="modal">Cancel</a>
		</div>
	</div>
	
	
	

</body>
</html>